<template>
  <div>
  <page-header-wrapper>
    <a-page-header title="费用设置" @back="() => $router.go(-1)" style="background-color: #fff" />
      <a-card>
        <a-form-model
            ref="coordinateForm"
            :rules="rules"
            :model="info"
            :labelCol="{ span: 4 }"
            :wrapperCol="{ span: 10 }"
          >
            <a-form-model-item label="店铺开通金额" prop="open_price">
              <a-input v-model="info.open_price" />
            </a-form-model-item>
            <a-form-model-item label="续费金额" prop="renew_price">
              <a-input v-model="info.renew_price" />
            </a-form-model-item>
  
            <a-form-model-item label="代理分润比利(%)" prop="profit">
              <a-input
                type="number"
                :min="0"
                :max="100"
                :step="0.1"
                precision="2"
                :addon-after="'%'"
                v-model="info.profit"
              />
            </a-form-model-item>
            <a-form-model-item :wrapper-col="{ span: 24 }">
              <a-divider style="margin:0 0 40px 0;"/>
              <div style="display: flex; justify-content: center;">
                <a-button :loading="btnLoading" type="primary" @click="submitForm" style="margin-right: 8px">
                  保存
                </a-button>
                <a-button @click="$router.back()"> 取消 </a-button>
              </div>
            </a-form-model-item>
          </a-form-model>
      </a-card>
    </page-header-wrapper>
  </div>
</template>

<script>
import { setStoreReOrder, getStoreReOrder } from '@/api/store'
export default {
  data() {
    return {
      rules: {
        open_price: [{ required: true, message: '请输入商城开通金额', trigger: 'blur' }],
        renew_price: [{ required: true, message: '请输入商城续费金额', trigger: 'blur' }],
        profit: [{ required: true, message: '代理分润比利', trigger: 'blur' }],
      },
      info: {
        open_price: '',
        renew_price: '',
        profit: '',
      },
      btnLoading:false,
    }
  },
  created() {
    this.getData()
  },

  methods:{
    getData () {
      this.loading = true
      getStoreReOrder()
        .then((res) => {
          if (res.code == 0) {
            this.$nextTick(() => {
              this.info = res.data
            })
          }
        })
        .catch((error) => {
          console.log(error)
        })
        .then(() => {
          this.loading = false
        })
    },

    submitForm () {
      this.$refs.coordinateForm.validate((valid) => {
        if (valid) {
          this.btnLoading = true
       
          setStoreReOrder(this.info)
            .then((res) => {
              if (res.code == 0) {
                this.$message.success('保存成功！')
              } else {
                this.$message.warning(res.msg ? res.msg : '保存失败！')
              }
            })
            .catch((error) => {
              console.log(error)
            })
            .then(() => {
              this.btnLoading = false
            })
        }
      })
    },
  }
}
</script>

<style lang="less" scoped>
</style>